<!-- 章节作业 -->
<template>
    <div>
        <!-- 导航条 -->
        <navigation></navigation>
        <template>
            <el-table :data="worktests" style="width: 100%" :border="true">
                <el-table-column type="index" label="序号" width="100">
                </el-table-column>
                <el-table-column prop="description" label="作业">
                </el-table-column>
                <el-table-column prop="startTime" label="开始时间">
                </el-table-column>
                <el-table-column prop="endTime" label="结束时间">
                </el-table-column>
                <el-table-column prop="state" label="状态">
                    <template slot-scope="scope">
                        <span v-if="scope.row.state === 0">未开始</span>
                        <span v-if="scope.row.state === 1">进行中</span>
                        <span v-if="scope.row.state === 2">已结束</span>
                    </template>
                </el-table-column>
                <el-table-column prop="score" label="分数">
                </el-table-column>
                <el-table-column label="操作">
                    <template slot-scope="scope">
                        <el-button type="primary" @click="going(scope.row.id,scope.row.state,scope.row.workType)"
                            v-if="scope.row.state===1">开始</el-button>
                        <el-button type="primary" @click="going(scope.row.id,scope.row.state,scope.row.workType)"
                            v-if="scope.row.state===2">查看</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </template>
    </div>
</template>

<script>
    import navigation from '/src/views/navigation.vue'
    export default {
        components: {// 通过 components节点，为当前的组件注册私有子组件
            "navigation": navigation,
        },
        props: {
            userId: {
                type: Number,
                required: true
            },
            classId: {
                type: Number,
                required: true
            },
        },
        created() {
            this.getworkTest()
        },
        data() {
            return {
                // 作业列表
                worktests: [],
            };
        },
        methods: {
            // 路由跳转并携带参数id
            async going(id, state, workType) {
                const { data: res } = await this.$axios.get('/isgoingTo', {
                    params: {
                        state: state,// 状态
                        workId: id,//试卷id
                        userId: this.userId,// 用户id
                    }
                })
                if (workType === 1) {//测试题目1
                    // 检查是否可以跳转
                    if (res.data === 1) {
                        // 1表示提交，表名已经提交了答案但是并没有到这个时间的结束时间，因此不能查看试
                        return this.$message("你已经提交，还没有到结束时间，不可以查看试卷")
                    } else if (res.data === 3) {
                        // 3TODO表示已经到了结束时间，因此需要跳转到只能观察答案的界面
                        this.$router.push(`worktest1View/${id}`);
                        return
                    } else {
                        window.sessionStorage.setItem('workId', id)
                        window.sessionStorage.setItem('workState', state)
                        window.sessionStorage.setItem('workType', workType)

                        this.$router.push(`worktest1/${id}`);
                    }
                }
                if (workType === 2) {//测试题目2
                    this.$router.push(`worktest2/${id}`);
                }
            },

            // 根据班级id获取测试数据
            async getworkTest() {
                const { data: res } = await this.$axios.get('/getworkTest', {
                    params: {
                        classId: this.classId,// 班级id
                        userId: this.userId
                    }
                })
                if (res.code === 200) {
                    return this.worktests = res.data
                }
                this.$message.error("网络错误")
            }
        }
    }
</script>